@mixin dingwei() {
  /* 定义flex容器 */
  display: flex;
  /*设置容器内部容器的排列方向*/
  flex-direction: row;
}

@mixin danhang1() {
  /* 单行...*/
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

@mixin imgsize() {
  width: 100%;
  height: 100%;
}

@mixin colorbj() {
  width: 40rpx;
  height: 40rpx;
  border-radius: 50rpx;
}

@mixin shuanghang2() {
  /* 两行...*/
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
  white-space: normal !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

page {
  background-color: #f6f6f6;
}
.content {
  padding-top: 20rpx;
  padding: 20rpx;
}

// 品牌
.brands {
  .headtext {
  }

  .history {
    margin-top: 20rpx;
    width: 702rpx;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 10rpx 0px rgba(0, 0, 0, 0.14);
    border-radius: 10rpx;
    margin-bottom: 10rpx;
    padding: 20rpx;
  }

  .hisxbox {
    width: 132rpx;
    text-align: center;
    margin-bottom: 10rpx;
    margin-top: 20rpx;

    .hisimg {
      image {
        width: 80rpx;
        height: 80rpx;
      }
    }

    .histext {
      width: 132rpx;
      text-align: center;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: rgba(102, 102, 102, 1);
      @include danhang1;
    }

    .imgbrand {
      image {
        width: 80rpx;
        height: 80rpx;
      }
    }
  }

  .abcd {
    padding: 20rpx 0rpx;
  }
  .list-cell {
    box-sizing: border-box;
    width: 100%;
    padding: 10rpx 0px 0px 0px;
    overflow: hidden;
    color: #323233;
    font-size: 14px;
    line-height: 24px;
    border-bottom: 1px solid #eeeeee;
  }
  .Brandcsss {
    width: 702rpx;
    background: #ffffff;
    box-shadow: 0px 0px 10rpx 0px rgba(0, 0, 0, 0.14);
    border-radius: 10rpx;
    padding: 0 20rpx;
  }
  .brandcss {
    display: flex;
    flex-direction: row;
  }
  .area {
    text-align: left;
    font-size: 30rpx;
    font-family: PingFang SC;
    font-weight: 500;
    color: rgba(102, 102, 102, 1);
    line-height: 80rpx;
    width: 50%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .floor {
    position: fixed;
    top: 400rpx;
    right: 30rpx;
    font-size: 26rpx;
    font-weight: bold;
    color: #999999;
  }

  .iconimgs {
    margin-right: 20rpx;
    image {
      width: 80rpx;
      height: 80rpx;
    }
  }
  .iconimg {
    margin-right: 20rpx;
    image {
      width: 80rpx;
      height: 80rpx;
    }
  }

  .weiyouchey {
    text-align: center;
    font-size: 28rpx;
    font-family: PingFang SC;
    font-weight: 500;
    color: rgba(153, 153, 153, 1);
    line-height: 100rpx;
    width: 100%;
  }
}

// 系列
.xilie {
  /* 背景颜色 */
  .bjcolor {
    width: 100%;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 10rpx 0px rgba(0, 0, 0, 0.14);
    border-radius: 10rpx;
  }
  .ppbox {
    background: #f6f6f6;
    .weyou {
      text-align: center;
      font-size: 28rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: rgba(153, 153, 153, 1);
      line-height: 220rpx;

      .iconimg {
        width: 100%;
        height: 60rpx;

        image {
          width: 100rpx;
          height: 100rpx;
        }
      }
    }
  }

  .containepp {
    .num {
      padding: 30rpx 0rpx;
      color: #606266;
      width: 100%;
      font-weight: 500;
      font-size: 28rpx;
      line-height: 40rpx;
    }

    .list-cell {
      overflow: hidden;
      height: 100rpx;
      line-height: 100rpx;
      display: flex;
      align-items: center;
      border-bottom: 1px solid #eeeeee;
    }

    .name {
      float: left;
      width: 500rpx;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: rgba(102, 102, 102, 1);
      @include danhang1;
    }

    .iconimg {
      width: 80rpx;
      height: 80rpx;
      float: left;
      margin-right: 20rpx;

      image {
        width: 80rpx;
        height: 80rpx;
      }
    }
  }
}
.selecboxsimg {
  .imgbrands {
    width: 50rpx;
    height: 50rpx;
    margin-right: 10rpx;
    image {
      width: 50rpx;
      height: 50rpx;
    }
  }
  .xiant {
    width: 32rpx;
    height: 2rpx;
    background: #666666;
  }
}

// 车子
.carname {
  .bjcolor {
    width: 100%;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 10rpx 0px rgba(0, 0, 0, 0.14);
    border-radius: 10rpx;
  }
  .containepp {
    .num {
      padding: 30rpx 0rpx;
      color: #606266;
      width: 100%;
      font-weight: 500;
      font-size: 28rpx;
      line-height: 40rpx;
    }

    .list-cell {
      overflow: hidden;
      height: 100rpx;
      line-height: 100rpx;
      display: flex;
      align-items: center;
      border-bottom: 1px solid #eeeeee;
    }

    .name {
      float: left;
      width: 500rpx;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: rgba(102, 102, 102, 1);
      @include danhang1;
    }

    .name1 {
      float: left;
      width: 100%;
      color: #666;
      font-weight: 500;
      font-size: 30rpx;
      @include danhang1;
    }

    .name2 {
      float: left;
      width: 200rpx;
      font-size: 34rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: rgba(102, 102, 102, 1);
      text-align: right;
      @include danhang1;
    }
    .floor {
      position: fixed;
      top: 400rpx;
      right: 40rpx;
      font-size: 26rpx;
      font-weight: bold;
      color: #999999;
    }
    .iconimg {
      width: 80rpx;
      height: 80rpx;
      float: left;
      margin-right: 20rpx;

      image {
        width: 80rpx;
        height: 80rpx;
      }
    }
  }
  .contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* background-color: #FFFFFF; */
    height: 300rpx;
    width: 306rpx;
    margin-top: -300rpx;
    margin-left: 200rpx;

    .mpvue-picker-view {
      width: 100%;
      height: 75%;
      .item {
        text-align: center;
        width: 100%;
        height: 88upx;
        line-height: 88upx;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 40upx;
      }
      // /deep/ .uni-picker-view-content{
      //     background-image: linear-gradient(to top,#ffffff);
      //     width: 91%;
      //     margin-left: 8px;
      // }
      /deep/ .uni-picker-view-mask {
        background: none !important;
        left: 40rpx !important;
        width: 75% !important;
      }
      /deep/ .uni-picker-view-indicator,
      .uni-picker-view-mask {
        left: 40rpx !important;
        width: 75% !important;
      }
      /deep/ .uni-picker-view-indicator {
        border-top: 1px solid #fbb000;
        border-bottom: 1px solid #fbb000;
      }
    }
  }
}
